<template>
	<view class="box">
    <swiper class="swiper" autoplay="true" interval="1000">
      <swiper-item>
        <image src="../../static/swiper/1.png"></image>
      </swiper-item>
      <swiper-item>
        <image src="../../static/swiper/2.png"></image>
      </swiper-item>
      <swiper-item>
        <image src="../../static/swiper/3.png"></image>
      </swiper-item>
      <swiper-item>
        <image src="../../static/swiper/4.png"></image>
      </swiper-item>
      <swiper-item>
        <image src="../../static/swiper/5.png"></image>
      </swiper-item>
      <swiper-item>
        <image src="../../static/swiper/6.png"></image>
      </swiper-item>
    </swiper>
    
    <view class="card">
      <image src="../../static/huiyuan.png"></image>
    </view>
    
    <view class="huodong">
      <view>最新活动</view>
      <image src="/static/huodong.png"></image>
    </view>
  </view>
  
</template>

<script setup>

</script>

<style lang="scss">
  page{
    background-color:#ECECEA ;
  }
  .box{
    width: 100%;
    
    .swiper{
      height: 50vh;
      widows: 100%;
      image{
        width: 100%;
        height: 95%;
      }
    }
    
    .card{
      // border: 0.5px black solid;
      width: 90%;
      border-radius: 10px;
      height: 40vh;
      margin: 0 auto;
      background-color: white;
      
      image{
        width: 100%;
        height: 100%;
        margin: 0 auto;
      }
    }
    
    .huodong{
      width: 90%;
      margin: 0 auto;
      margin-top: 10px;
      margin-bottom: 10px;
      font-size: 10px;
      height: 20vh;
      
      image{
        height: 90%;
        width: 100%;
      }
    }
  }
</style>
